<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>作业</title>
	</head>
	<style>
		/* 外层容器 */
		div#container{
			width: 800px;
			height: 200px;
			border: 1px solid #cccccc;
			border-width: 2px;
			margin-bottom: 10px;
		}
		div#line{
			width: 700px;
			height: 1px;
			background-color: #cccccc;
			margin: 0 auto;
			margin-top: 40px;
		}
		div#d1{
			width: 20px;
			height: 20px;
			border: 1px solid red;
			border-width: 1px;
			border-color: #ffffff;
			margin-left: 10px;
			padding-left: 10px;
			border-radius: 4px 4px 4px 4px;
		}
		div a{
			border: 1px solid #ccc;
			padding: 8px;
			margin-left: 5px;
		}
		div a.current{/*加权重*/
			border: 0;
			color: #000;
			/* text-decoration超文本文本装饰属性：none 去掉下划线
			                                    underline  默认  自带下划线
												line-through  删除线
			*/
			text-decoration: none;
		}
	</style>
	<body>
		<div id="container">
			<div id="line"></div>
		</div>
		<div>
		    <a href="#" class="current">1</a>
		    <a href="#">2</a>
		    <a href="#">3</a>
		    <a href="#">4</a>
		    <a href="#">5</a>
			<a href="#">6</a>
		</div>
	</body>
</html>